<template>
    <main class="page-bg" id="canvasDom">
        <BMap v-if="show" :canvasHeight="100" :data="mapData" />
        <section class="headline" data-html2canvas-ignore="true">
            <ScreenshotKit :iconColor="'#000000'" :downloadName="'中国地图'" />
        </section>
    </main>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import ScreenshotKit from '@/components/common/ScreenshotKit.vue';
import BMap from '@/components/maps/BaseMap.vue';
const show = ref(false)
let mapData = reactive({})

const init = () => {
    show.value = true
}
init()

</script>

<style scoped>
.page-bg {
    width: 100%;
    min-height: 100vh;
    background: linear-gradient(to right, #39b4f6, #7de0fe, #ffffff);
}
.headline {
    position: fixed;
    top: 20px;
    right: 50px;
}
</style>
